<template>
  <div class="app-container home">
    <el-row :gutter="20">
      <el-col :span="12" class="topinfor">
		 <el-card>
		    <h3>营收数据</h3>
			<el-row :gutter="20">
				<el-col :span="12">
					<div>
					  <el-statistic title="今日营收">
						<template slot="formatter">
						  456/2
						  <span class="font14 color6 margintop10">
							  (同比昨日
							  <span class="green">+10%</span>)
						  </span>
						</template>
					  </el-statistic>
					</div>
				</el-col>
				<el-col :span="12">
					<div>
					  <el-statistic title="退款金额">
						<template slot="formatter">
						  456/2
						  <span class="font14 color6 margintop10">
							  (同比昨日
							  <span class="green">+10%</span>)
						  </span>
						</template>
					  </el-statistic>
					</div>
				</el-col>
			</el-row>
		 </el-card>
      </el-col>

      <el-col :span="12"  class="topinfor">
		  <el-card>
		  	<h3>订单数据</h3>
		  	<el-row :gutter="20">
		  		<el-col :span="6">
		  			<div>
		  			  <el-statistic title="待支付订单">
		  				<template slot="formatter">
		  				  2
		  				</template>
		  			  </el-statistic>
		  			</div>
		  		</el-col>
		  		<el-col :span="6">
		  			<div>
		  			  <el-statistic title="待使用订单">
		  				<template slot="formatter">
		  				  45
		  				</template>
		  			  </el-statistic>
		  			</div>
		  		</el-col>
				<el-col :span="6">
					<div>
					  <el-statistic title="已完成订单">
						<template slot="formatter">
						  456
						</template>
					  </el-statistic>
					</div>
				</el-col>
				<el-col :span="6">
					<div>
					  <el-statistic title="退款/售后">
						<template slot="formatter">
						  45
						</template>
					  </el-statistic>
					</div>
				</el-col>
		  	</el-row>
		  </el-card>
      </el-col>
    </el-row>
	<div>
		<div ref="commandstats" style="height: 420px" />
	</div>
  </div>
</template>

<script>
import * as echarts from "echarts";
export default {
  name: "Index",
  data() {
    return {
      like: true,
	  value1: 4154.564,
	  value2: 1314,
	  title: "今日营收",
	  //统计数据
	  data:{}
    };
  },
  mounted() {
  	this.getDataTj()
  },
  methods: {
    goTarget(href) {
      window.open(href, "_blank");
    },
	getDataTj(){
		this.commandstats = echarts.init(this.$refs.commandstats, "macarons");
		this.commandstats.setOption({
		  xAxis: {
			type: 'category',
			data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
		  },
		  yAxis: {
			type: 'value'
		  },
		  series: [
			{
			  data: [150, 230, 224, 218, 135, 147, 260],
			  type: 'line'
			}
		  ]
		});
		window.addEventListener("resize", () => {
		  this.commandstats.resize();
		});
	}
  }
};
</script>

<style scoped lang="scss">

</style>

